html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,and,address,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,input,textarea,select{background:transparent;border:0;font-size:100%;margin:0;outline:0;padding:0;font-family: MontLight;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}del{text-decoration:line-through}hr{background:transparent;border:0;clear:both;color:transparent;height:1px;margin:0;padding:0}mark{background-color:#ffffb3;font-style:italic}input,select{vertical-align:middle}ins{background-color:red;color:white;text-decoration:none}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}
.clear{clear:both;display:block;height:0;overflow:hidden;visibility:hidden;width:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;height:0;line-height:0;visibility:hidden;width:0}* html .clearfix,:first-child+html .clearfix{zoom:1}
    img { max-width: 100%; }
    .f6 { font-weight: 500; font-family: daxie; }
    body {
        color: #636363;
        overflow-y: auto;
        overflow-x: hidden; font-family: MontLight;
        -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
        -webkit-text-size-adjust: 100%;
    }
    :root { 
        --hcolor: #de5f6f;
        --wbfb: 5%;
     }
    a, a > * {
        color: #333;
        text-decoration: none;
        -webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
           -moz-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
            -ms-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
             -o-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
                transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out, outline .2s ease;
    }
    a:hover, a > *:hover {
        color: var(--hcolor); 
    }

    a.g-link { color: #333; text-decoration: none; }
    a.g-link:hover { color: var(--hcolor);  text-decoration: none;}
    
    ::-moz-selection { background: #333; color: #fff; text-shadow: none; }
    ::selection { background: #333; color: #fff; text-shadow: none; }

    h1 { font-size: 30px; }
    h2 { font-size: 24px; }
    h3 { font-size: 18px; font-weight: 400; }
    h4 { font-size: 16px; font-weight: 400; }
    h5 { font-size: 12px; }
    h6 { font-size: 11px; }

    h1, h2, h3, h4, h5, h6 {
        color: #333;
        line-height: 1.25;
        /*text-transform: uppercase; */
    }
@font-face {
    font-family:daxie;
    src: url('./fonts/Montserrat-Regular.ttf');
}
@font-face {
    font-family:MontReg;
    src: url('./fonts/Montserrat-Regular.ttf');
}
@font-face {
    font-family:MontLight;
    src: url('./fonts/Montserrat-Light.otf');
} 
@font-face {
    font-family:xiaoxie;
    src: url('./fonts/Montserrat-Light.otf');
}
.news_time { background: #333; z-index: 9999; height: 50px; line-height: 48px; color: #fff; font-family: daxie;  }
/* ------------------------------------------------------------------------------- */
/*  3.  Header
/* ------------------------------------------------------------------------------- */
.pagebg { width: 100%; height: 600px; position: relative; background: url(../images/bg.jpg) no-repeat center center; background-size: 100%;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size:cover;}
.page-profile { width: 100%; height: 600px; position: relative; background: url(../images/cbg1.jpg) no-repeat center center; background-size: 100%;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size:cover;}
.page-hangye { width: 100%; height: 600px; position: relative; background: url(../images/cbg2.jpg) no-repeat center center; background-size: 100%;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size:cover;}
.page-contact { width: 100%; height: 600px; position: relative; background: url(../images/cbg3.jpg) no-repeat center center; background-size: 100%;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size:cover;}
.pagebg .company-name,
.page-profile .company-name,
.page-hangye .company-name,
.page-contact .company-name { position: absolute; bottom: 200px; width: 100%; font-family: MontReg;  margin-top: 100px; font-weight: bold; text-align: center; color: #fff; font-size: 60px; z-index: 11; }
.profile-bg { background: url(../images/bg2.jpg) no-repeat center bottom #0181e6; background-size: 100%;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size:cover; min-height: 770px; }

    #header {
        height: 160px; position: relative; margin-left: 5%; margin-right: 3%; z-index: 9999;
    }
    #header .menu { display: none; }
    #header .mlang { display: none; }
    #header .lang { display: block; }
    #logo {
        float: left; padding-top: 20px;
    }
    #logo img { height: 100px; }
    /*  Navigation  --------------------------------*/
    #navigation { float: right; }
    #navigation li {
        float: left;
        position: relative;
    }
    #navigation > li:first-child { display: none; }
    #navigation a {
        color: #fff;
        display: block;
        font-family: MontLight;
        font-size: 16px;
        font-weight: 400;
        margin: 0 0 0 30px;
        padding: 55px 0 5px;
        position: relative; 
    }
    #navigation > li:last-child a { margin-left:10px; }
    #navigation li.gray img { -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray; }
    #navigation li.gray img:hover { -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
    filter: all;  }
    #navigation a:hover, #navigation .hover > a, #navigation .current > a {
        color: var(--hcolor); text-decoration: none; border-bottom: var(--hcolor) solid 2px;
    }
    #navigation a:hover span, #navigation .hover > a span, #navigation .current > a span {  color: var(--hcolor); }
    /*  Dropdown  --------------------------------*/
    #navigation ul {
        background: #fff;
        border-top: var(--hcolor) solid 2px;
        display: none;
        left: 0;
        margin: 0 0 0 30px;
        padding: 0;
        position: absolute;
        top: 82px;
        width:calc(100% + 30px);
        z-index: 9999;
    }
    #navigation ul li {
        float: none;
        border-bottom: none;
        z-index: 9999;
    }
 
    #navigation ul li i {
        background: url(../images/menu_i.png) no-repeat 0 0;
        height: 5px;
        position: absolute;
        right: 10px;
        top: 40%;
        width: 3px;
    }
    #navigation ul a {
        color: #333;
        display: block;
        font-size: 14px;
        font-weight: 400;
        margin: 0;
        padding: 8px 10px;
        text-transform: none;
         
    }
    #navigation ul a:hover, #navigation ul .hover > a, #navigation ul .current > a, #navigation ul .current > a:hover {
        color: var(--hcolor); background: #f5f5f5; border-bottom: none;
    }
    /*  Sub Dropdown  --------------------------------*/

    #navigation ul ul {
        left: 190px;
        width: 100%;
        margin: 0;
        top: -2px;
    }
    /*  Responsive Nav  --------------------------------*/
     ul.our-profile { display: -webkit-flex; display: flex; margin: 50px var(--wbfb); }
     ul.our-profile li { display: flex; flex: 1; align-items: center; flex-wrap: wrap; justify-content: flex-start; flex-direction: column; text-align: center; }
     ul.our-profile li:nth-child(2) { margin:0 35px;}
     ul.our-profile li p { color: #787878; }
     ul.our-profile li h3 { font-family: daxie; }
     ul.our-profile li span { font-size: 48px; color: #ccc; }

.pro-title { text-align: center; padding: 40px 0;  }
.pro-title h3 { position: relative; color: #000; font-family: daxie;  font-weight: 300; margin: 0 auto; display: inline-block; font-weight: bold; font-size: 32px; }
.pro-title h4,
.right h4 { content: ''; margin-left: calc(50% - 5px);  background:var(--hcolor); width: 10px; height: 6px; }
.pro-title p { padding: 0; width: 66%; margin-left: 17%; font-size: 14px; }


.our-news-bg {  background: #5dbae0; }
.our-news-bg2 { background: #d18b27; }
.upcolor { color: #fff; }
.mindu { padding-top: 40px; }
 ul.caselist { display: -webkit-flex; display: flex; margin:0 20px 20px; padding-bottom: 60px; }
 ul.caselist li { border:#faf8fa solid 3px; display: flex; flex: 1; align-items:left; flex-wrap: wrap; justify-content: flex-start; flex-direction: column; text-align: left; padding: 20px; background: #5dbae0; }
 ul.caselist li:nth-child(2) { margin:0 20px;}
 ul.caselist li p { color: #fff; font-size: 12px; }
 ul.caselist li h3 { margin:5px 0; overflow: hidden; width: 100%; text-overflow:ellipsis; }
 ul.caselist li h3 a { color: #fff; font-size: 18px; }
 ul.caselist li h3 a:hover { color: var(--hcolor); text-decoration: none; }
 ul.caselist li a,
 ul.caselist li a span { color: #fff; font-size: 12px;  }
 ul.caselist li:hover { background: none; border: var(--hcolor) solid 3px;  }
 ul.caselist li a.hc { color: #f00; }

 .consultancy { padding:20px 50px 50px; text-align: center; }
 .consultancy .gtext { text-align: center; }
 .consultancy .gtext img { max-width: 460px; }

 ul.industries { display: -webkit-flex; padding-bottom: 30px; display: flex; justify-content:space-between; margin:0 12%; }
 ul.industries li { display: flex; }
 ul.industries li span { font-size: 66px; color: #fff; }
 ul.industries li:nth-child(2) span { font-size: 54px; margin-top: 8px; }
 ul.industries li:nth-child(3) span { font-size: 60px; margin-top: 0; }
 ul.industries li:nth-child(4) span { font-size: 60px; margin-top: 0; }
 ul.industries li:nth-child(5) span { font-size: 52px; margin-top: 9px; }
 ul.industries li:nth-child(6) span { font-size: 76px; margin-top: -10px; }
 ul.industries li:nth-child(7) span { font-size: 60px; margin-top: 2px; }
 ul.industries li:nth-child(8) span { font-size: 68px; margin-top: -12px; }
 ul.industries li:nth-child(9) span { font-size: 62px; margin-top: 0; }
 ul.industries li:nth-child(10) span { font-size: 60px; margin-top: 0; }
 ul.industries li:hover span { color: #000; }

 .about {display: -webkit-flex; padding: 70px 0; display: flex; justify-content:space-between; margin:0 15%;}
 .about .left { flex: 3; }
 .about .left img { max-width: 100%; }
 .about .right { flex: 7; padding-left: 45px; }
 .about .right h2 { font-weight: bold; font-family: daxie; text-align: center; }
 .about .right .aboutext { padding: 15px 0; line-height: 21px; font-size: 12px; }
 .about .right .aboutn a { background: var(--hcolor); color: #fff; padding: 4px 20px 7px; font-size: 12px; border-radius: 3px; }
 .about .right p { margin-bottom: 20px; }
 .about .right img { max-height: 26px; }
 
#footer { background:#2e2e2e; padding:20px 0; }
#footer .foot-title { font-size: 16px; color: var(--hcolor); padding-bottom: 10px; margin-left: 5%; margin-right: 5%;  }
#footer .foot-form { display: -webkit-flex;display: flex; justify-content: space-between; align-items: flex-start; margin-left: 5%; margin-right: 5%; }
#footer .foot-form input[type="text"] {
    background: none; border:#383838 solid 1px; padding: 5px 10px; color: #fff; font-size: 12px;
 }
#footer .foot-form .name { width: 18%; }
#footer .foot-form .needs { width: 54%; }
#footer .foot-form button { width: 8%; background: var(--hcolor); color: #fff; font-size: 14px; padding: 5px 0; }
#footer .hr { height: 1px; background: #383838; width: 100%; margin-top: 20px; }

#copyright{ padding: 10px 0; margin-left: 5%; margin-right: 5%; display: flex; justify-content: space-between; align-items: flex-start;  }
#copyright .copy-link { padding: 15px 0 10px; font-size: 12px; text-align: left;  color: #fff; line-height: 27px; font-family: xiaoxie; }
#copyright .copy-link a { color: #fff; font-size: 12px; }
#copyright .copy-link a:hover { color: var(--hcolor);  }
#copyright .copy-logo img { height: 80px; margin-top: 35px; }

.profile { margin: 0 15%; }
.profile dt { padding: 10px 0; border-bottom: #dedede solid 1px; font-size: 14px; font-family: daxie; font-weight: 200; display: flex; }
.profile dt span { margin: -2px 7px 0; }
.profile dt a { color: #000; font-family: daxie;}
.profile dt a:hover { color: var(--hcolor); }
.profile dd { padding: 25px 0 10px; line-height: 26px; font-size: 14px; }
.profile dd p { margin-bottom: 26px; }

.profile ul.class-cases {    }
.profile ul.class-cases li { display: -webkit-flex; display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; color: #000; }
.profile ul.class-cases li span { font-size: 20px; color: #ccc; margin-right: 20px; }

.profile .con1 { text-align: center; padding-top: 20px; }
.profile .con1 img { max-width: 460px; margin: 0 auto; }
.profile .con2 { text-align: center; }
.profile .con2 img { max-width: 100%; margin: 0 auto; }
.profile .conA { margin-top: 50px;  }
.profile .conA h4,
.profile .conA h4 span { font-size: 18px; font-family: daxie; }
.profile .conA h4 span { display: inline-block; width: 30px; text-align: left; }
.profile .conA img { margin:20px; max-width: 80%;  }
.profile .conA .mb { margin-bottom: 10px; }
.profile .ml30 { padding-left: 30px; }
.profile ul.ylist li { background: url(../images/yuanbg.png) no-repeat left 8px; background-size: 14px; padding-left: 25px;
    color: #2455a8;  }
/* ------------------------------------------------------------------------------- */
/*  15.  Media Queries
/* ------------------------------------------------------------------------------- */

    /* Standard 960 or larger (browsers) */
    @media only screen and (min-width: 960px) and (max-width: 1025px) {
         #header {
            position: relative; margin-left:1%; margin-right: 1%;
         }
         #logo img { height: 80px; }
         #navigation a {
            margin: 0 0 0 15px;
         }
         #navigation ul {
            left: -50px;
        }
    }



    /* Smaller than standard 960 (devices and browsers) */
    @media only screen and (max-width: 959px) {

    }



    /* Tablet Portrait size to standard 960 (devices and browsers) */
    @media only screen and (min-width: 768px) and (max-width: 959px) {
        #header {
            height: 80px; position: relative;
        }
        #header .mlang { display: block; display: flex; justify-content: center; align-items: center; }
        #header .mlang img { margin:0 10px; }
        #header .lang { display: none; }
        #header .menu { display: block; color: #fff; position: absolute; right: 15px; top: 20px; font-size: 28px; }
        #logo {
            float: left; padding-top: 20px;
        }
        #logo img { height: 80px; }
    /*  Navigation  --------------------------------*/
        #navigation { float: none; position: fixed; left: 0; top: 0; height: 100%; background:rgba(0,0,0,.9); display: flex; justify-content: flex-start; align-items: center; flex-direction: column; z-index: 9999;  width: 100%;
        overflow: auto; display: none; }
        #navigation li { width: 100%;  padding: 10px 0;
            float: none; text-align: center;
            position: relative;
        }
        #navigation > li:first-child { display: block; border-bottom: none; height: 50px; }
        #navigation > li:last-child a { margin-left:0; }
         
        #navigation a {
            margin: 0; width: auto; display: inline-block;
            padding: 10px 0;
        }
        /*  Dropdown  --------------------------------*/
        #navigation ul {
            left: 0;
            margin: 0;
            padding: 0;
            position: absolute;
            top: 50px;
            width:100%;
            z-index: 9999;
            border-top: none;
        }
    }

    /* All Mobile Sizes (devices and browser) */
    @media only screen and (max-width: 767px) { 
        :root { 
         --wbfb: 2%;
        }
    }

    /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
    @media only screen and (min-width: 480px) and (max-width: 767px) {
         
    }

    @media only screen and (min-width: 320px) and (max-width: 480px) {

        .consultancy { padding: 0 0 50px; text-align: center; }
        .consultancy .gtext img { max-width: 300px; }

        ul.our-profile { flex-direction: column; margin:25px 5%; }
        ul.our-profile li h3,
        ul.our-profile li p { margin-top: 0; }
        
        ul.industries {  flex-wrap: wrap; margin:0 5%; padding-bottom: 25px;  }
        ul.industries li { display: flex; flex: 20%; justify-content: center; align-items: center; }
        ul.industries li span { font-size: 56px; color: #fff; }
         ul.industries li:nth-child(2) span { font-size: 44px; margin-top: 8px; }
         ul.industries li:nth-child(3) span { font-size: 50px; margin-top: 0; }
         ul.industries li:nth-child(4) span { font-size: 50px; margin-top: 0; }
         ul.industries li:nth-child(5) span { font-size: 42px; margin-top: 9px; }
         ul.industries li:nth-child(6) span { font-size: 66px; margin-top: 2px; }
         ul.industries li:nth-child(7) span { font-size: 50px; margin-top: 2px; }
         ul.industries li:nth-child(8) span { font-size: 58px; margin-top: -12px; }
         ul.industries li:nth-child(9) span { font-size: 52px; margin-top: 0; }
         ul.industries li:nth-child(10) span { font-size: 50px; margin-top: 0; }
        ul.caselist { flex-direction: column; margin:10px; padding-bottom: 20px; }
        ul.caselist li { padding: 10px; margin-bottom: 10px;  }
        ul.caselist li:nth-child(2) { margin:0 0 10px;}

        .about { flex-direction: column-reverse; margin:0 5%;}
        .about .right { background: rgba(255,255,255,.6); margin-top: -50px; margin-bottom: 30px; padding-left: 0; }
         
        

        .pagebg { width: 100%; height: 320px; }
        .pagebg .company-name { margin-top: 80px; line-height: 38px; font-size: 36px; }
        .pagebg .cname { margin-top: 100px; }

        .pro-title p { padding: 0; width: 88%; margin-left: 6%; font-size: 12px; }
        
        #header {
            height: 80px; position: relative;
        }
        #header .mlang { display: block; display: flex; justify-content: center; align-items: center; }
        #header .mlang img { margin:0 10px; }
        #header .lang { display: none; }
        #header .menu { display: block; color: #fff; position: absolute; right: 15px; top: 20px; font-size: 28px; }
        #logo {
            float: left; padding-top: 20px;
        }
        #logo img { height: 80px; }
    /*  Navigation  --------------------------------*/
        #navigation { float: none; position: fixed; left: 0; top: 0; height: 100%; background:rgba(0,0,0,.9); display: flex; justify-content: flex-start; align-items: center; flex-direction: column; z-index: 9999;  width: 100%;
        overflow: auto; display: none; }
        #navigation li { width: 100%;  padding: 10px 0;
            float: none; text-align: center;
            position: relative;
        }
        #navigation > li:first-child { display: block; border-bottom: none; height: 50px; }
        #navigation > li:last-child a { margin-left:0; }
         
        #navigation a {
            margin: 0; width: auto; display: inline-block;
            padding: 10px 0;
        }
        /*  Dropdown  --------------------------------*/
        #navigation ul {
            left: 0;
            margin: 0;
            padding: 0;
            position: absolute;
            top: 50px;
            width:100%;
            z-index: 9999;
            border-top: none;
        }
         
        #footer .foot-form { flex-direction: column;  }
        #footer .foot-form input[type="text"] { height: 40px; -webkit-appearance: none; border-radius: 0;  }
        #footer .foot-form .name { width: 100%; margin-bottom: 10px; }
        #footer .foot-form .needs { width: 100%; margin-bottom: 10px;  }
        #footer .foot-form button { width: 100%;  padding: 12px 0; }
        #copyright{ flex-direction: column; justify-content: center; align-items: center;  }
        #copyright .copy-link { text-align: center;  }
        #copyright .copy-logo img { height: 80px; margin-top: 0; }

        .profile { margin: 5px 5%; }
        .profile dt,
        .profile dd { font-size: 12px; }

        .profile .con1 img { max-width: 300px; }
        .profile .conA { margin-top: 30px;  }
        .profile .conA h4,
        .profile .conA h4 span { font-size: 16px;  }
        .profile .conA h4 span {  width: 20px;}
        .profile .conA img { margin:10px; max-width: 88%;  }
        .profile .ml30 { padding-left: 20px; }
        .profile ul.ylist li { background-size: 12px; padding-left: 20px; color: #2c62ea;  }

}

    /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
    @media only screen and (max-width: 320px) {

    }




